<#assign module="driver"/>

<@override name="header">
<link rel="stylesheet" href="${ctx}/assets/css/datepicker/datepicker.css">
<link rel="stylesheet" href="${ctx}/assets/css/datetimepicker.css">
</@override>
<@override name="body">
<div class="row">
		<div class="col-xs-12 col-md-6">
			<div class="orders-navt">
				<ul class="orders-nav">
			    <li><a href="${ctx}/driver/list" >员工</a></li>
			    <@shiro.hasPermission name='driverapply'>
			    <li><a href="${ctx}/driverapply/list" >申请</a></li>
			    </@shiro.hasPermission>
			    <li class="orders-click" style="width:90px;"><a href="${ctx}/driver/recordlist" class="orders-click-a">通话记录</a></li>
			</ul>
			</div>
		</div>
  <div class="col-xs-12 col-md-4">
  	<form class="form-inline" role="form">
  		<div class="form-group">
  			<button id="delete_checked" type="button" class="btn btn-default"><i class="icon-trash"></i>&nbsp;删除选中记录</button>
  		</div>
  		<div class="form-group">
		    <input type="text" class="form-control" name="param" value="${param?if_exists}" placeholder="输入服务人员姓名、服务人员电话、来电号码">
	  	</div>
		<div class="form-group">
	  		<button type="submit" class="btn btn-primary"><i class="icon-search"></i>&nbsp;搜索</button>
	  	</div>
  	</form>
  </div>
  
  <div class="col-xs-12 col-md-2">
  		<button class="pull-right buttoncss" onclick="window.location='${ctx}/driver/add';"><b>+</b>&nbsp;新增服务人员</button>
  </div>
</div>
<div class="row margin-top">
	<div class="col-xs-12">
	<div class="panel panel-primary">
	<div class="table-responsive">
		<table class="table table-hover table-striped">
			<thead>
			<tr style="font-size:14px;">
				<th><input type="checkbox" id="checkAll"></th>
				<th>服务人员姓名</th>
				<th>服务人员电话</th>
				<th>对方号码</th>
				<th>对方姓名</th>
				<th>通话时间</th>
				<th>是否为本公司客户</th>
				<th>通话时长（秒）</th>
				<th>30分钟内是否有订单</th>
				<th>操作</th>
			</tr>
			</thead>
			<tbody>
				<#if (page.content)?? >
			  	<#list page.content as data>
					<tr>
						<td><input value="${data.id}" type="checkbox" name="ids"></td>
						<td>${data.driverName?if_exists}</td>
						<td>${data.driverPhone?if_exists}</td>
						<td>${data.memberPhone?if_exists}</td>
						<td>${data.memberName?if_exists}</td>
						<td>
							${data.phoneDate?datetime}
						</td>
						<td>
							<#if data.currentCompany>
								是
							<#else>
								否
							</#if>
						</td>
						<td>
							<#if data.phoneType==1>
								<#if (data.phoneTime>0)>
									${data.phoneTime}(来电)
								<#else>
									(服务人员挂断)
								</#if>
							<#elseif data.phoneType==2>
								<#if (data.phoneTime>0)>
									${data.phoneTime}(去电)
								<#else>
									(服务人员/客户挂断)
								</#if>
							<#elseif data.phoneType==3>
								(客户挂断/服务人员未接)
							</#if>
						</td>
						<td>
							<#if data.hasOrders>
								有
							<#else>
								<font color="red">没有</font>
							</#if>
						</td>
						<td>
							<a href="javascript:;" data-value="${data.id}" class="btn-link deletethis">删除</a>
						</td>
					</tr>
				</#list>
				</#if>
			</tbody>
		</table>
		<#if page.totalElements??>
		<ul class="pagination pull-right pagination-sm">
			<li><a>共 ${page.totalElements} 条数据</a></li>
			<@pg.pager items=page.totalElements?number maxPageItems=20 export="currentPageNumber=pageNumber" url="${ctx}/driver/recordlist">
				<@pg.param name="param" value="${param?if_exists}"/>
				<@pg.index>
					<@pg.first>
						<li><a href="${pageUrl}">&laquo;</a></li>
					</@pg.first>
					<@pg.prev>
						<li><a href="${pageUrl}">&lsaquo;</a></li>
					</@pg.prev>
					<@pg.pages>
						<#if  currentPageNumber == pageNumber >
							<li class="active"><a href="#">${pageNumber}</a></li>
						<#else>
							<li><a href="${pageUrl}">${pageNumber}</a></li>
						</#if>
					</@pg.pages>
					<@pg.next>
						<li><a href="${pageUrl}">&rsaquo;</a></li>
					</@pg.next>
					<@pg.last>
						<li><a href="${pageUrl}">&raquo;</a></li>
					</@pg.last>
				</@pg.index>
			</@pg.pager>
		</ul>
		</#if>
	</div>
	</div>
	</div>
</div>

</@override>



<@override name="footer">
	<script type="text/javascript">
		window.daijia = {
			ctx:'${ctx}',
			userId:'<@shiro.principal property='id'/>'
		};
	</script>
	<script src="${ctx}/assets/js/pushmessage.js"></script>
	<script type="text/javascript">
		var thisButton;
		function deleteRecord() {
		    $.post('${ctx}/driver/deleteRecord',{'id':thisButton.attr("data-value")},function(data){
		            if(data.success){
		                $.scojs_message('通话记录删除成功', $.scojs_message.TYPE_OK);
		                window.location.reload(true);
		            } else {
		                $.scojs_message(data.message, $.scojs_message.TYPE_ERROR);
		            }
		    },'json');
		}
		function deleteRecords() {
			var delete_ids=[]; 
			$("input[name=ids]:checked").each(function(index,element){
		    	delete_ids.push($(element).val());
		    });
		    $.post('${ctx}/driver/deleteRecords',{'ids':delete_ids.toString()},function(data){
		            if(data.success){
		                $.scojs_message('通话记录删除成功', $.scojs_message.TYPE_OK);
		                window.location.reload(true);
		            } else {
		                $.scojs_message(data.message, $.scojs_message.TYPE_ERROR);
		            }
		    },'json');
		}
		
		$(document).ready(function(){
		    $(".deletethis").click(function(){
		          thisButton = $(this);
		          var confirm = $.scojs_confirm({
		            content: "你真的要删除该通话记录吗？",
		            action:deleteRecord
		          });
		          confirm.show();
		    });
		    
		    $("#checkAll").click(function(){
		    	var thischeck=this.checked;
		    	$("input[name=ids]").each(function(index,element){
		    		element.checked=thischeck;
		    	});
		    });
		    
		    $("#delete_checked").click(function(){
		    	if($("input[name=ids]:checked").length<=0){
		    		$.scojs_message("请勾选需要删除的记录", $.scojs_message.TYPE_ERROR);
		    		return false;
		    	}
		    	thisButton = $(this);
		        var confirm = $.scojs_confirm({
			        content: "你真的要删除勾选的通话记录吗？",
			        action:deleteRecords
		        });
		        confirm.show();
		    	
		    	
		    });
		    
		    
		});
	</script>
	<script src="${ctx}/assets/js/datepicker.js"></script>
</@override>
<@extends name="../layout.ftl"/>